<body>
	<h1>Mountains</h1>
	<div id="mountains"></div>
	<div id="mountains" onload="create()">
	</div>
	<script>
		const MOUNTAINS = [{
				name: "Mont Blanc",
				height: 4808,
				place: "Italy/France"
			},
			{
				name: "Popocatepetl",
				height: 5465,
				place: "Mexico"
			}
		];
		// Your code here
		onload = function () {
			var c = function (c) {
				return document.createElement(c);
			}
			var mytable = c("table");
			var mytbody = c("tbody");
			document.body.appendChild(mytable);
			mytable.appendChild(mytbody);
			for (var i = 0; i < MOUNTAINS.length; i++) { //i<MOUNTAINS.length改动
				var mytr = c("tr");
				mytbody.appendChild(mytr);
				for (var j = 0; j < 3; j++) {
					var mytd = c("td");
					mytr.appendChild(mytd);
					if (j == 0) {
						var mytxt = document.createTextNode(MOUNTAINS[i].name);
					} else if (j == 1) {
						var mytxt = document.createTextNode(MOUNTAINS[i].height);
					} else if (j == 2) {
						var mytxt = document.createTextNode(MOUNTAINS[i].place);
					}
					//var mytxt = document.createTextNode(MOUNTAINS[i].name);//MOUNTAINS[i].name改动
					mytd.appendChild(mytxt);
					mytd.width = 200;
					mytd.height = 50;
				}
			}
			mytable.setAttribute('border', '1px');
		}
	</script>
</body>

</html>